import Vue from 'vue'
import axios from 'axios'
import { Notification } from 'element-ui'

const http = axios.create({
  baseURL: 'http://192.168.213.135:8080',
  timeout: 5000
})

/**
 * 1.所有的请求都会走该拦截器， config就是网络请求的配置.
 * 2.会将原本的请求的http信息传递给config, 然后最终我们发送到服务器的http的信息是由该方法返回的。
 */
http.interceptors.request.use(config => {
  // 获取cookie中的access_token
  let accessToken = Vue.$cookies.get('access_token')

  // 如果说cookie中包含有 access_token 那么就将其放到请求头中
  if(accessToken) {
    config.headers['Authorization'] = `Bearer ${accessToken}`
  }
  return config
})

/**
 * 所有的响应的都会经过 response, response.use() 方法接收两个参数:
 *  1.第一个参数当响应的状态码为 2xx, resp是响应的数据
 *  2.第二个参数当响应的状态码为 4xx, 5xx， 就走第二个方法 err => {}
 */
let notifyStatus = true
http.interceptors.response.use(resp => {
  return resp
}, err => {
  let status = err.response.status
  if(status === 401 && notifyStatus) {  // 401表示没有登录或者认证过期，那么需要清空cookie, 然后重新登录
    notifyStatus = false
    Vue.$cookies.remove('access_token')
    Vue.$cookies.remove('username')
    Notification ({
      title: '提示',
      message: '登录已过期，需要重新登录',
      type: 'info'
    });
    setTimeout(()  => {
      notifyStatus = true
      location.href = 'http://192.168.213.136/#/login'
    }, 1200)
  }else if(status === 403) {

  }else if(status === 500) {
    Notification ({
      title: '提示',
      message: '服务器端错误',
      type: 'info'
    });
  }
})

export default http
